<!DOCTYPE html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org">
<head th:replace="public/index2 :: CSS(~{::title})">
    <title>Godz的战斗力</title>
</head>
<body>
<!--菜单栏-->
<nav th:insert="~{public/index2 :: index2Head}"></nav>
<!-- 主屏幕 教师 -->
<section id="hero" class="d-flex align-items-center">
    <div class="container">
        <div class="row">
            <div class="col-lg-6 d-flex flex-column justify-content-center pt-4 pt-lg-0 order-2 order-lg-1"
                 data-aos="fade-up" data-aos-delay="200">
                <h1>我学会技能,可以用来吃饭的技能</h1>
                <h2>学习之路刻苦铭心,难,苦,煎熬.</h2>
                <div class="d-flex justify-content-center justify-content-lg-start">
                    <a href="/index2/teacher" class="btn-get-started scrollto">我的恩师我的学习之路</a>
                    &nbsp;&nbsp;
                    <a href="https://space.bilibili.com/99987465" target="blank" class="btn-get-started scrollto"><i
                            class="bi bi-play-circle"></i>访问我的哔哩哔哩</a>
                </div>
            </div>
            <div class="col-lg-6 order-1 order-lg-2 hero-img" data-aos="zoom-in" data-aos-delay="200">
                <img src="assets/myIndex2/img/hero-img.png" class="img-fluid animated" alt="">
            </div>
        </div>
    </div>

</section>
<!--主要内容-->
<main id="main">
    <!-- 我主攻方向 -->
    <section id="why-us" class="why-us section-bg">
        <div class="container-fluid" data-aos="fade-up">
            <div class="row">
                <div class="col-lg-7 d-flex flex-column justify-content-center align-items-stretch order-2 order-lg-1">
                    <div class="content">
                        <h3>我的主要方向是面向<strong>Web端和手机移动端开发方向</strong></h3>
                        <p>
                            因为大学学习时间只用了2年,大一大二都在补算法,数学等基础,大二开始深度修吃饭的技能点,当然最容易入门的就是Web端,所以就从Web开始,读研阶段肯定还会向安卓移动端或者比较流行的新语言出发,毕竟时代变迁之快.指不定那天现在学习的知识体就已经被淘汰了
                        </p>
                    </div>
                    <div class="accordion-list">
                        <ul>
                            <li>
                                <a data-bs-toggle="collapse" class="collapse" data-bs-target="#accordion-list-1"><span>01</span>
                                    Web
                                    <i class="bx bx-chevron-down icon-show"></i><i
                                            class="bx bx-chevron-up icon-close"></i></a>
                                <div id="accordion-list-1" class="collapse show" data-bs-parent=".accordion-list">
                                    <p>
                                        重点就是Web,大学一年级就开始的学习的一个阶段,因为是图形化设计,上手非常容易,所以学起来也非常快.其次本身在大学开始之前就非常熟练掌握平面设计,如Adobe家族的PhotoShop,Illustrator等.对于海报,logo和各种UI设计有很大的经验.因为从小玩到大.
                                        我做海报或者各种UI,基本都是按照苹果公司或者各种大公司设计模式.尺规作图等等.
                                        目前Web端已经学会了并熟练掌握的有HTML+CSS+JS三剑客,当然肯定是包括H5,TS像这种东西上手太简单了.然后也熟练使用JQuery.还有一堆插件像轮播图Swiper,图表Echar等等.这种都是老式html模式开发.
                                        目前我的开发方式是Vue-Cli,脚手架模式.大部分是做控制平台使用.Vue.js是尤雨溪大哥的超级框架.节约大量时间和代码量.我非常喜欢.Vue全家桶都熟练了,算不上精通,但是很熟练使用.能搭建想要的各种需求.反正前端就是代码越多,看的越爽.越好看
                                    </p>
                                </div>
                            </li>

                            <li>
                                <a data-bs-toggle="collapse" data-bs-target="#accordion-list-2" class="collapsed"><span>02</span>
                                    Java
                                    <i class="bx bx-chevron-down icon-show"></i><i
                                            class="bx bx-chevron-up icon-close"></i></a>
                                <div id="accordion-list-2" class="collapse" data-bs-parent=".accordion-list">
                                    <p>
                                        Java是我学时间最长的一个了,我是跟哔哩哔哩狂神大哥学的,当然基础语句也是在学校和书本上自学的.所有语言基础部分都一样,循环啊,数据类型啊,条件判断啊...上手Java基础还是很快的.然后就开始多做算法题,练练大脑逻辑和熟悉Java语句.等都差不多,大二的时候我就开始学习框架了
                                        当然我首先学的是Web后端框架,Spring全家桶都学了.跟着狂神大哥一路过五关斩六将.因为学后端知识体比较全面,数据库 Linux语句 Git上传下载
                                        Docker虚拟机 Nginx域名跳来跳去
                                        ElasticSearch搜索引擎 Redis内存数据库,关机一剪没!还有一些类似模板引擎Thymeleaf这种.还有阿里的各种框架,使用起来还是比较舒服的
                                        后端的话因为是Java,Java太多知识体了,肯定不能说精通
                                        光JVM或者JUC就够难啃了,只能说知道.会用部分...比如网络就挺好用的,做个在线QQ还是可以的...
                                    </p>
                                </div>
                            </li>

                            <li>
                                <a data-bs-toggle="collapse" data-bs-target="#accordion-list-3" class="collapsed"><span>03</span>
                                    未来方向? <i class="bx bx-chevron-down icon-show"></i><i
                                            class="bx bx-chevron-up icon-close"></i></a>
                                <div id="accordion-list-3" class="collapse" data-bs-parent=".accordion-list">
                                    <p>
                                        学的多,不如学的精通. 但是未来的可能性充满未知,搞不好今年流行的技术,明天就淘汰没人用了.所以说,无限的学习,跟着时代的科技脚步,这边一更新,那边就学习.岂不美哉!
                                    </p>
                                </div>
                            </li>

                        </ul>
                    </div>

                </div>

                <div class="col-lg-5 align-items-stretch order-1 order-lg-2 img bgimggodz"
                     data-aos="zoom-in"
                     data-aos-delay="150">
                </div>
            </div>

        </div>
    </section>
    <!-- 特殊技能 -->
    <section id="skills" class="skills">
        <div class="container" data-aos="fade-up">

            <div class="row">
                <div class="col-lg-6 d-flex align-items-center" data-aos="fade-right" data-aos-delay="100">
                    <img src="assets/myIndex2/img/skills.png" class="img-fluid" alt="">
                </div>
                <div class="col-lg-6 pt-4 pt-lg-0 content" data-aos="fade-left" data-aos-delay="100">
                    <h3>特殊爱好</h3>
                    <p class="font-italic">
                        除开工作之外的娱乐技能点
                    </p>

                    <div class="skills-content">

                        <div class="progress">
                            <span class="skill">运动(跑步,篮球,健身) <i class="val">100%</i></span>
                            <div class="progress-bar-wrap">
                                <div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="0"
                                     aria-valuemax="100"></div>
                            </div>
                        </div>

                        <div class="progress">
                            <span class="skill">乐器(钢琴,吉他等)<i class="val">70%</i></span>
                            <div class="progress-bar-wrap">
                                <div class="progress-bar" role="progressbar" aria-valuenow="70" aria-valuemin="0"
                                     aria-valuemax="100">
                                </div>
                            </div>
                        </div>

                        <div class="progress">
                            <span class="skill">机械电子(电子元器件,钳工技能等)<i class="val">55%</i></span>
                            <div class="progress-bar-wrap">
                                <div class="progress-bar" role="progressbar" aria-valuenow="55" aria-valuemin="0"
                                     aria-valuemax="100">
                                </div>
                            </div>
                        </div>

                        <div class="progress">
                            <span class="skill">平面设计和影视后期<i class="val">85%</i></span>
                            <div class="progress-bar-wrap">
                                <div class="progress-bar" role="progressbar" aria-valuenow="85" aria-valuemin="0"
                                     aria-valuemax="100">
                                </div>
                            </div>
                        </div>

                    </div>
                    <p class="font-italic">
                        属于自己爱好,跑步是从小跑到大都跑了快10年了,钢琴是高中学的,跟着音乐老师后面学了一个大概,剩下自己摸索...
                        钳工也是高中学的,职业技能大赛.随便选了一个钳工,顺便考了钳工四级证书.平面设计与影视后期也是玩了10年了,自己美术感还是比较强,就特效自己还是比较薄弱,其他都基本熟练...
                    </p>
                </div>

            </div>

        </div>
    </section>
    <!-- 最近项目 -->
    <section id="services" class="services section-bg">
        <div class="container" data-aos="fade-up">

            <div class="section-title">
                <h2>开发类-项目经历</h2>
                <text>近期主要的项目经历</text>
            </div>

            <div class="row">
                <div class="col-xl-3 col-md-6 d-flex align-items-stretch"
                     data-aos="zoom-in"
                     data-aos-delay="100"
                     th:each="item:${items}">
                    <div class="icon-box">
                        <div class="icon"><i class="bx bxl-dribbble"></i></div>
                        <h4 class="titlegodz"><a th:href="'/index2/itemCon?id='+${item.getId()}"
                                                 th:text="${item.getItemName()}"></a></h4>
                        <p class="textgodz" th:text="${item.getItemSecond()}"></p>
                    </div>
                </div>
            </div>

        </div>
    </section>
    <!-- 联系我 -->
    <section id="cta" class="cta">
        <div class="container" data-aos="zoom-in">

            <div class="row">
                <div class="col-lg-9 text-center text-lg-start">
                    <h3>合作-投资-开发-创业</h3>
                    <p>
                        如果你有合作,请联系我.非常乐意与你一起合作.我是你最棒的合伙人
                    </p>
                </div>
                <div class="col-lg-3 cta-btn-container text-center">
                    <a class="cta-btn align-middle" href="index.html#Content">联系我</a>
                </div>
            </div>

        </div>
    </section>
    <!-- 我的奖项 -->
    <section id="portfolio" class="portfolio">
        <div class="container" data-aos="fade-up">

            <div class="section-title">
                <h2>我的荣誉奖项</h2>
                <text>学生时期获得的比较重要奖项</text>
            </div>

            <ul id="portfolio-flters" class="d-flex justify-content-center" data-aos="fade-up" data-aos-delay="100">
                <li data-filter="*" class="filter-active">全部</li>
                <li data-filter=".filter-Tech">科技类</li>
                <li data-filter=".filter-Lite">文艺类</li>
                <li data-filter=".filter-Phys">体育类</li>
            </ul>

            <div class="row portfolio-container" data-aos="fade-up" data-aos-delay="200">
                <!-- class中添加 filter-XXX为主 -->
                <div class="col-lg-4 col-md-6 portfolio-item"
                     th:classappend="${hp.getCname()}"
                     th:each="hp:${HpList}">
                    <a th:href="'/index2/priceCon?id='+${hp.getId()}" class="details-link">
                        <div class="portfolio-img"><img th:src="${hp.getHpImg1()}" class="img-fluid"></div>
                        <div class="portfolio-info">
                            <h4 th:text="${hp.getHpTitle()}"></h4>
                            <p th:text="${hp.getHpHtitle()}"></p>
                        </div>
                    </a>
                </div>
            </div>

        </div>
    </section>
    <!-- Godz的一些特殊问题? -->
    <section id="faq" class="faq section-bg">
        <div class="container" data-aos="fade-up">
            <div class="section-title">
                <h2>Godz的秘密</h2>
                <text>Godz的一些特殊秘密和爱好的来源,为什么会出现这样性格的神张涛</text>
            </div>

            <div class="faq-list">
                <ul>
                    <li data-aos="fade-up" data-aos-delay="100" th:each="secret:${secretList}">
                        <i class="bx bx-help-circle icon-help"></i>
                        <a data-bs-toggle="collapse" th:data-bs-target="'#faq-list-'+${secret.getId()}"
                           class="collapsed">
                            <text th:text="${secret.getSecretTitle()}"></text>
                            <i class="bx bx-chevron-up icon-show"></i>
                            <i class="bx bx-chevron-down icon-close"></i>
                        </a>
                        <div th:id="'faq-list-'+${secret.getId()}" class="collapse" data-bs-parent=".faq-list">
                            <p th:text="${secret.getSecretCon()}"></p>
                        </div>
                    </li>

                </ul>
            </div>

        </div>
    </section>

</main>
<!--底层内容-->
<nav th:insert="~{public/index2 :: index2Footer}"></nav>
<!-- 一键回头 -->
<div id="preloader"></div>
<a href="#" class="back-to-top d-flex align-items-center justify-content-center">
    <i class="bi bi-arrow-up-short"></i>
</a>
<!-- Js框架文件 -->
<nav th:insert="~{public/index2 :: index2Js}"></nav>
</body>

</html>